<template>
  <j-modal
    :title="title"
    :width="width"
    :visible="visible"
    switchFullscreen
    :fullscreen="fullscreen"
    @ok="handleOk"
    :okButtonProps="{ class: { 'jee-hidden': disableSubmit } }"
    @cancel="handleCancel"
    :footer="null"
    cancelText="关闭"
  >
  <a-spin :spinning="confirmLoading">
      <!-- 查询区域 -->
      <div class="table-page-search-wrapper">
        <a-form layout="inline" @keyup.enter.native="searchQuery">
          <a-row :gutter="24">
            <a-col :xl="6" :lg="7" :md="8" :sm="24">
              <a-form-item label="单号">
                <a-input placeholder="支持输入入库/物流/采购/调拨单号" v-model="queryParam.orderNo"></a-input>
              </a-form-item>
            </a-col>
            <a-col :xl="6" :lg="7" :md="8" :sm="24">
              <a-form-item label="产品名称">
                <a-input placeholder="产品名称" v-model="queryParam.productName"></a-input>
              </a-form-item>
            </a-col>
            <a-col :xl="8" :lg="7" :md="8" :sm="24">
              <a-form-item label="质检要求">
                <a-radio-group v-model="queryParam.qcRequirement" :options="qcRequirementData" @change="loadData(1)"></a-radio-group>
              </a-form-item>
            </a-col>
            <a-col :xl="2" :lg="7" :md="8" :sm="24">
              <span style="float: left; overflow: hidden" class="table-page-search-submitButtons">
                <a-button type="primary" @click="searchQuery" icon="search">查询</a-button>
                <a-button type="primary" @click="searchReset" icon="reload" style="margin-left: 8px">重置</a-button>
              </span>
            </a-col>
          </a-row>
        </a-form>
      </div>
      <!-- 查询区域-END -->
      <!-- 操作按钮区域 -->
      <div class="table-operator">
        <a-button @click="handleQualityInspectionAndCheck(null,'batch','check')" type="primary">批量点数</a-button>
        <a-button @click="handleQualityInspectionAndCheck(null,'batch','inspection')" type="primary" stype="margin:0 5px">批量质检</a-button>
        <a-button @click="handleReceiving(null,'batch')" type="primary" stype="margin:0 5px">批量收货</a-button>
        <a-button @click="selectPrintBathHandle" type="primary">批量打印</a-button>
      </div>
      <!-- 操作按钮区域 -->
      <a-table
        ref="table"
        size="middle"
        :scroll="{ x:true }"
        bordered
        rowKey="id"
        :columns="columns"
        :dataSource="dataSource"
        :pagination="ipagination"
        :loading="loading"
        :rowSelection="{ selectedRowKeys: selectedRowKeys, onChange: onSelectChange }"
        class="j-table-force-nowrap"
        @change="handleTableChange"
      >
        <!-- 图片 -->
        <template slot="productMainImgSlot" slot-scope="text, record">
          <span v-if="!text" style="font-size: 12px; font-style: italic">无图片</span>
          <img :src="record.productMainImg" v-else width="auto" height="120px" @click="previewHandle(record)" />
        </template>
        <!-- 产品信息 -->
        <template slot="productSpecSlot" slot-scope="text, record">
          <div class="product-name">
            <label>产品名称：</label><div class="content">{{record.productName}} </div>
          </div>
          <div class="product-name">
            <label>颜色/尺寸：</label><div class="content">{{record.color}}<span v-if="record.size">&nbsp;/&nbsp;{{record.size}}</span></div>
          </div>
          <div class="product-name">
            <label>仓库SKU：</label><div class="content"><a>{{record.warehouseSku}} </a></div> 
          </div>
          <div class="product-name">
            <label>是否质检：</label><div class="content" :style="{color:setColor(record.qcRequirement)}">{{record.qcRequirement_dictText}}<span v-if="record.qcRequirement==='2'">（{{record.samplingQty || 0}}）</span>  </div>
          </div>
          <div class="product-name">
            <label>规格(cm)：</label><div class="content">{{record.specifications}}</div> 
          </div>
          <div class="product-name">
            <label>毛重(kg)：</label><div class="content">{{record.grossWeight}}</div> 
          </div>
        </template>
        <!-- 单号信息 -->
        <template slot="inboundOrderNoSlot" slot-scope="text, record">
          <div class="row">
            <label>入库：</label><div class="content"><a @click="warehouseDetailHandle(record)">{{record.inboundOrderNo}}</a> </div>
          </div>
          <div class="row">
            <label>采购：</label><div class="content"><a>{{record.purchaseOrderNo}}</a><span style="color: #1890ff">&nbsp;[{{ record.purchasingSource }}]</span> </div>
          </div>
          <div class="row">
            <label>调拨：</label><div class="content"><a>{{record.transferOrderNo}}</a> </div>
          </div>
          <div class="row" style="margin-top:10px">
            <a-tag v-if="record.qcStatus" color="#F96500">质检</a-tag>
            <a-tag v-if="record.qtyStatus" color="#F96500" style="margin-left:5px">点数</a-tag>
          </div>
        </template>
        <!-- SKU入库情况 -->
        <template slot="planQtySlot" slot-scope="text, record">
          <div class="row"><label>计划：</label><div class="content">{{ record.planQty }}</div></div>
          <div class="row"><label>已收：</label><div class="content">{{ record.receivedQty }}</div></div>
          <div class="row"><label>未收：</label><div class="content">{{ record.unreceivedQty }}</div></div>
          <div class="row"><label>残次：</label><div class="content">{{ record.defectiveQty }}</div></div>
          <div class="row"><label>上架：</label><div class="content">{{ record.shelvedQty }}</div></div>
          <div class="row"><label>实点：</label><div class="content">{{ record.actualQty }}</div></div>
          <div class="row"><label>通过：</label><div class="content">{{ record.passedQty }}</div></div>
        </template>
        <!-- 采购信息 -->
        <template slot="purchaseSlot" slot-scope="text, record">
        <div class="row">
          <label>公司：</label>
          <j-ellipsis :value="record.purchaseCompany" width="260px"></j-ellipsis>
        </div>
        <div class="row">
          <label>组织：</label>
          <j-ellipsis :value="record.purchaseOrganization" width="260px"></j-ellipsis>
        </div>
        <div class="row">
          <label>采购员：</label>
          <j-ellipsis :value="record.purchaserName" width="260px"></j-ellipsis>
        </div>
        <div class="row">
          <label>采购SKU备注：</label>
          <j-ellipsis :value="record.purchaseRemark" width="260px" style="color: #ff0000"></j-ellipsis>
        </div>
      </template>
      <!-- 数量 -->
      <template slot="quantitySlot" slot-scope="text, record, index">
        <div>
          <a-input-number 
            v-model="record.actualQty_new"
            placeholder="实收数量(无残次)"
            :precision="0"
            :formatter="transformNum"
            :parser="transformNum"
            :disabled="record.receiveStatus === '3' ? true :false"
            style="width:90%"
            @change="(value) => qtyChange(value, record, index)"
            @keypress="handleKeyPress"
            ></a-input-number>
            <!-- <div class="err-msg">{{record.actualQtyErrMsg}}</div> -->
        </div>
        <div style="margin-top:10px">
          <a-input-number 
            v-model="record.defectiveQty_new"
            placeholder="残次数量(有残次)"
            :formatter="transformNum"
            :parser="transformNum"
            :disabled="record.receiveStatus === '3' ? true :false"
            @change="(value) => qtyChange(value, record, index)"
            @keypress="handleKeyPress"
            style="width:90%"
            ></a-input-number>
           <!-- <div class="err-msg">{{record.defectiveQtyErrMsg}}</div>  -->
           <div class="err-msg">{{record.errorMsg}}</div> 
        </div>
      </template>
        <span slot="action" slot-scope="text, record,index">
          <div v-if="record.batchNumber"><a @click="handlePrint(record)">打印条码</a></div>
          <!-- 抽检或全检，未收货或部分收货状态下允许质检 -->
          <div v-if="['2','3'].indexOf(record.qcRequirement) >-1 && ['1','2'].indexOf(record.receiveStatus) >-1" style="margin-top:10px"><a @click="handleQualityInspectionAndCheck(record,'single','inspection')" style="color:#F96500">质检</a></div>
          <!-- 未收货或部分收货状态下允许收货 -->
          <div v-if="['1','2'].indexOf(record.receiveStatus) >-1" style="margin:10px 0"><a @click="handleReceiving(record,'single')" >收货</a></div>
          <!-- 免检，未收货，部分收货状态下允许点数 -->
          <div v-if="record.qcRequirement === '1' && ['1','2'].indexOf(record.receiveStatus) >-1"><a @click="handleQualityInspectionAndCheck(record,'single','check')" style="color:#F96500;">点数</a></div>
        </span>
      </a-table>
    </a-spin>
    <product-image-preview ref="imageRef"></product-image-preview>
    <warehouse-inbound-detail-modal ref="warehouseDetail"></warehouse-inbound-detail-modal>
    <!-- 打印数量 -->
    <a-modal :visible="printVisible" title="打印数量" :confirm-loading="printConfirmLoading" :width="300" @cancel="printVisible =false">
       <a-input-number v-model="printModel.actualQty_new" placeholder="请输入打印数量" :formatter="transformNum" :parser="transformNum" @keypress="handleKeyPress" style="width:100%"></a-input-number>
       <template slot="footer">
        <div style="text-align:center">
          <a-button type="primary" style="width:80%;margin-bottom: 4px" @click="printBathHandle">打印条码</a-button>
        </div>
       </template>
    </a-modal>
  </j-modal>
</template>
<script>
import '@/assets/less/TableExpand.less'
import { mixinDevice } from '@/utils/mixin'
import { JeecgListMixin } from '@/mixins/JeecgListMixin'
import productImagePreview from './productImagePreview.vue'
import { postAction,getAction } from '@/api/manage'
import warehouseInboundDetailModal from './warehouseInboundDetailModal'
import { getLodop } from "@/utils/lodopPrint"
export default {
  name: 'inboundProductListModel', //扫码收货
  mixins: [JeecgListMixin, mixinDevice],
  components:{productImagePreview,warehouseInboundDetailModal},
  data() {
    return {
      title: '',
      width: 1200,
      visible: false,
      disableSubmit: false,
      fullscreen:true,
      confirmLoading:false,
      inboundOrderNoId:'',  //入库单id
      queryParam: {
        qcRequirement:'',   //质检要求默认为全部
      },
      disableMixinCreated:true,    //手动调用loadData 加载数据方法
      qcRequirementData: [
        //质检要求
        { label: '全部', value: '' },
        { label: '全检', value: '3' },
        { label: '抽检', value: '2' },
        { label: '免检', value: '1' },
      ],
      printVisible:false,  //单SUK打印数量弹窗
      printConfirmLoading:false,
      //单SKU打印Model
      printModel:{},
      // 表头
      columns: [
        {
          title: 'NO',
          dataIndex: '',
          key: 'rowIndex',
          width:40,
          align: 'center',
          customRender: function (t, r, index) {
            return parseInt(index) + 1
          },
        },
        { 
          title: '商品图片',
          align: 'center',
          dataIndex: 'productMainImg',
          scopedSlots: { customRender: 'productMainImgSlot' },
        },
        {
          width:300,
          title: '产品信息',
          align: 'center',
          dataIndex: 'productSpec',
          scopedSlots: { customRender: 'productSpecSlot' },
        },
        {
          title: '比例',
          align: 'center',
          dataIndex: 'componentRatio',
        },
        {
          width:200,
          title: '单号信息',
          align: 'center',
          dataIndex: 'inboundOrderNo',
          scopedSlots: { customRender: 'inboundOrderNoSlot' },
        },
        {
          title: '类型',
          align: 'center',
          dataIndex: 'receiveType_dictText',
        },
        {
          width:150,
          title: 'SKU入库情况',
          align: 'center',
          dataIndex: 'planQty',
          scopedSlots: { customRender: 'planQtySlot' },
        },
        {
          title: '状态',
          align: 'center',
          dataIndex: 'receiveStatus_dictText',
          customCell: (record, index) => {
            // 1.未收货,2.部分收货,3.收货完成 4.取消收货
            if (record.receiveStatus === '2') {
              return { style: { color: '#F96500' } }
            }
            if (record.receiveStatus === '3') {
              return { style: { color: '#1890FF' } }
            } else {
              return { style: { color: '#333333' } }
            }
          },
        },
        {
          width:250,
          title: '采购信息',
          align: 'center',
          dataIndex: 'purchaseOrderNo',
          scopedSlots: { customRender: 'purchaseSlot' },
        },
        {
          width:200,
          title: '数量',
          align: 'center',
          dataIndex: 'quantity',
          scopedSlots: { customRender: 'quantitySlot' },
        },
        {
          title: '操作',
          dataIndex: 'action',
          align: 'center',
          fixed: 'right',
          width: 110,
          scopedSlots: { customRender: 'action' },
        },
      ],
      url: {
        list: '/wms/inboundProduct/list',
        receiving:'/wms/inboundProduct/receiving',    //单个收货
        receivingBatch:'/wms/inboundProduct/receivingBatch',   //批量收货
        qualityInspection:'/wms/inboundProduct/qualityInspection',  //单个质检
        qualityInspectionBatch:'/wms/inboundProduct/qualityInspectionBatch',   //批量质检
        quantityCheck:'/wms/inboundProduct/quantityCheck',     //单点个数
        quantityCheckBatch:'/wms/inboundProduct/quantityCheckBatch',    //批量点数
      },
    }
  },
  methods: {
    showModal(id) {
      this.inboundOrderNoId = id ||''
      this.queryParam={
          qcRequirement:'',     //质检要求默认全部
       }
      this.dataSource =[]
      if(id){
        //单条收货
        this.queryParam.inboundOrderNoId = id
        this.loadData(1)
      }
      this.visible = true
    },
    //设置是否质检字体颜色
    setColor(status){
      // 1:免检  2.抽检  3.全检
      if(status === '1'){
        return '#333333'
      }
      if(status === '2'){
        return '#F96500'
      }else{
        return '#FF0000'
      }
    },
    //预览图片
    previewHandle(record){
       this.$refs.imageRef.showPreview(record)
    },
    //只能输入整数
    transformNum(value) {
      if (typeof value === 'string') {
        return !isNaN(Number(value)) ? value.replace(/\./g, '') : 1
      } else if (typeof value === 'number') {
        return !isNaN(value) ? String(value).replace(/\./g, '') : 1
      } else {
        return 1
      }
    },
    //打印条码数量弹窗
    handlePrint(record){
      this.printModel= Object.assign({},record)
      this.printVisible =true
    },

    //按数量批量打印SKU标签
    printBathHandle(){
      const that = this
      if(!this.printModel.actualQty_new || this.printModel.actualQty_new < 1){
        this.$message.warning('打印数量不能为0')
        return
      }else{
        const labelData=Array.from({length:that.printModel.actualQty_new},()=>({
           warehouseSku:that.printModel.warehouseSku,
           productName:that.printModel.productName,
           batchNumber:that.printModel.batchNumber,
         }))
        this.skuTagPrintHandle(labelData)
        this.printVisible = false  
      } 
    },
    //按选中数据批量打印SKU标签
    selectPrintBathHandle(){
      if(this.selectedRowKeys.length < 1){
        this.$message.warning('请先选择数据')
        return
      }
      //过滤掉没有收货批次编号的数据 和 实收数量为空或0的数据
      const actualQtySelectRowInfo = this.selectionRows.filter(s=>s.batchNumber && s.actualQty_new && s.actualQty_new > 0) ||[]
      if(actualQtySelectRowInfo.length < 1){
        this.$message.warning('Sku收货批次编号或实收数量不能为空')
        return 
      }
      //组装批量打印标签数据
      const selectLabels = actualQtySelectRowInfo.flatMap(item=>
         Array.from({length:item.actualQty_new},()=>({
           warehouseSku:item.warehouseSku,
           productName:item.productName,
           batchNumber:item.batchNumber,
         }))
      )
      this.skuTagPrintHandle(selectLabels)   
      this.onClearSelected()
    },
    //批量打印sku标签
    skuTagPrintHandle(labelData){
      try {
        const LODOP = getLodop();
        if (!LODOP) {
          this.$message.warning("未检测到C-Lodop打印服务，请先安装！")
          return;
        }
        // 初始化打印任务
        LODOP.PRINT_INIT("批量打印标签");
        const margin = 15; // 边距 
        // 循环打印每个标签
         labelData.forEach((item, index) => {
          if (index > 0) {
             LODOP.NEWPAGE(); // 新标签页
          }   
          // 设置标签尺寸  50*20mm
           LODOP.SET_PRINT_PAGESIZE(1, '50mm', '20mm', '');
          // 绘制（左侧）二维码 
          const qrSize = 65
           LODOP.ADD_PRINT_BARCODE(
            margin, margin, 65, 65, 
            "QRCode", item.warehouseSku
          );      
          // 绘制右侧内容
          const contentLeft = qrSize;
          // 标题:仓库SKU
          const warehouseSkuHtml=`<div style="font-size:16px;font-weight: bold;">${item.warehouseSku}</div>` 
          LODOP.ADD_PRINT_HTM(5,contentLeft,120,10,warehouseSkuHtml)
          //产品名称
          const productNameHtml=`
                 <div style="display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;font-size:10px;height: 20px;font-weight: bold;">
                  ${item.productName}</div>`
          LODOP.ADD_PRINT_HTM(27,contentLeft,120,20,productNameHtml)
          //收货批次编号
          const batchNumberHtml=`<div style="font-size:10px;">${item.batchNumber}</div>` 
          LODOP.ADD_PRINT_HTM(55,contentLeft,120,12,batchNumberHtml)
        });
         //LODOP.PRINT();  // 执行打印
         LODOP.PREVIEW()     //执行预览
      } catch (e) {
        console.error('打印出错:', e);
        alert('打印过程中出错: ' + e.message);
      }
    },
    //重置查询条件
    searchReset() {
      const that = this
      if(that.dataSource.length >0){
      this.$confirm({
        title:'重置后将清空收货页面',
        content: h => <div style="color:#999999;font-size: 16px;"><div style="color:red;">未收货数据将不被保存</div>你还要继续吗？</div>,
        onOk() {
          that.queryParam = {
            qcRequirement:'',
            inboundOrderNoId:that.inboundOrderNoId  
          }
          that.dataSource = []
        },
        onCancel() {
          console.log('Cancel');
        },
       })
     }
    },
    //关闭弹窗
    handleCancel(){
      const that = this
      //判断当前数据当中是否存在实收数量不为空的情况
      const isNullReceivedQty = this.dataSource.some(s=>s.actualQty_new && s.actualQty_new > 0)
      if(isNullReceivedQty){
        this.$confirm({
        title:'存在填写数量未收货SKU',
        content: h => <div style="color:#999999;font-size: 16px;"><div style="color:red;">若继续将不会保存收货数据</div>你还要继续吗？</div>,
        onOk() {
          that.visible = false
          that.$emit('ok')
        },
      })
      }else{
        that.visible = false
        that.$emit('ok')
      }
    },
    //收货详情
    warehouseDetailHandle(record){
      this.$refs.warehouseDetail.showModal(record.inboundOrderId)
    },
    //键盘输入
    handleKeyPress(e){
     // 阻止输入非数字字符
     const allowedKeys = ['0', '1', '2', '3', '4', '5', '6', '7', '8', '9']
        if (!allowedKeys.includes(e.key)) {
          e.preventDefault()
        }
    },
    //质检数量,实收数量 输入
    qtyChange(value, record, index){
      this.$set(this.dataSource[index],'errorMsg', '')
    },
  /**
   * 质检，点数 
   * @param record 
   * @param type  操作类型   single:单条   batch:批量
   * @param operationType  操作类型   inspection:质检  check:点数
   */
    handleQualityInspectionAndCheck(record,type,operationType){
      let parmas = null
      let apiUrl =''
      //判断是单条质检还是批量质检
      if(type === 'batch'){
        if(this.selectedRowKeys.length < 1){
          this.$message.warning('请先选择数据')
          return
         }
         apiUrl = operationType ==='inspection' ? this.url.qualityInspectionBatch :this.url.quantityCheckBatch
         parmas = this.selectionRows.map(item=>{
          return {
            actualQty:item.actualQty_new,
            defectiveQty:item.defectiveQty_new,
            id:item.id
           }
         })
      }else{
        parmas={
          actualQty:record.actualQty_new,
          defectiveQty:record.defectiveQty_new,
          id:record.id
        }
        apiUrl =operationType==='inspection' ? this.url.qualityInspection : this.url.quantityCheck
      }
      this.confirmLoading = true
      postAction(apiUrl,parmas).then(res=>{
          if(res.success){
            this.$message.success(res.message)
            this.loadData()
            if(res.result){
              //组装打印标签所需数据
              let {title, ...labelData } = res.result
              labelData.title=operationType ==='inspection' ? '质检单' :'点数单'
              this.generateQualityAndPointsTag(labelData)
            }
            this.onClearSelected()
          }else{
            this.$message.warning(res.message)
          }
        }).finally(()=>{
          this.confirmLoading = false
        })
    },

    //质检单，点数单打印标签
    generateQualityAndPointsTag(record){
      try {
        const LODOP = getLodop();
        if (!LODOP) {
          this.$message.warning("未检测到C-Lodop打印服务，请先安装！")
          return;
        }
          // 创建打印任务  
        LODOP.PRINT_INIT("标签打印");
        LODOP.SET_PRINT_PAGESIZE(1, '50mm', '20mm', ''); // 设置标签尺寸50*20mm
        // 添加二维码（左侧）
        LODOP.ADD_PRINT_BARCODE(10, 15, 70, 70, "QRCode",record.qcOrderNo);
        // 添加文本内容（右侧）
        const titleHtml=`<div style="font-size:18px;font-weight: bolder;">${record.title}</div>` 
        LODOP.ADD_PRINT_HTM(10,70,120,20,titleHtml)
        LODOP.ADD_PRINT_TEXT(32, 70, 130, 40, record.qcOrderNo);   
        LODOP.SET_PRINT_STYLEA(0, "FontSize",10);
        LODOP.ADD_PRINT_TEXT(50, 70, 130, 20, record.inboundOrderNo);  
        // 打印预览
        LODOP.PREVIEW();
        //LODOP.PRINT();
      }catch (e) {
        console.error('打印出错:', e);
        alert('打印过程中出错: ' + e.message);
      }
    },

  /**
   * 收货：实收数量和残次数量当中任意一个值不能为空，质检，点数：实收数量和残次数量都可以为空
   * @param record 
   * @param type  操作类型   single:单条 batch:批量
   */
    handleReceiving(record,type){
      if(type === 'batch' && this.selectedRowKeys.length < 1){
        this.$message.warning('请选择数据')
        return
      }
      let selectionRows=[]
      let apiUrl=''
      if(type === 'single'){
        apiUrl = this.url.receiving
        selectionRows = [record]  
      }else{
        apiUrl = this.url.receivingBatch 
        selectionRows = this.selectionRows  
      }
      const parmasArr = selectionRows.map(item=>{
          return {
            actualQty:item.actualQty_new,
            defectiveQty:item.defectiveQty_new,
            id:item.id
          }
        })
      const parmas = type === 'single' ? parmasArr[0] : parmasArr
      //判断选中的数据当中实收数量或残次数量是否有值
      const isNotNullselectionRows = selectionRows.every(s=>s.actualQty_new && s.actualQty_new>0 || s.defectiveQty_new && s.defectiveQty_new>0)
      if(isNotNullselectionRows){
        this.confirmLoading = true
        postAction(apiUrl,parmas).then(res=>{
          if(res.success){
            this.$message.success(res.message)
            this.loadData()
            this.onClearSelected()
          }else{
            this.$message.warning(res.message)
          }
        }).finally(()=>{
          this.confirmLoading = false
        })
      }
      else{   
        selectionRows.map(item=>{   
        if((!item.actualQty_new || item.actualQty_new < 1) && (!item.defectiveQty_new || item.defectiveQty_new < 1)){
          const index = this.dataSource.findIndex(s=>s.id === item.id)
          this.$set(this.dataSource[index],'errorMsg','实收数量或残次数量不能都为空')
        }
      })
      } 
    },
    loadData(arg) {
      if (arg === 1) {
        this.ipagination.current = 1;
      }
      var params = this.getQueryParams();
      this.loading = true;
      getAction(this.url.list, params).then((res) => {
        if (res.success) {
          if(res.result.records && res.result.records.length >0){
            res.result.records.map(item=>{
              item.actualQty_new = null
              item.defectiveQty_new = null
            })  
          }
          this.dataSource = res.result.records || []
          this.ipagination.total = res.result.total ? res.result.total :0
          this.$nextTick(()=>{
            this.$refs.table && this.$refs.table.$children[0].$children[0].$children[0].$children[0].$refs.table.debouncedWindowResize()
          }) 
        }else{
          this.$message.warning(res.message)
        }
      }).finally(() => {
        setTimeout(()=>{
          this.loading = false
        },300)
      })
    },
    handleOk() {
      this.$emit('ok')
    },
  },
}
</script>
<style lang="less" scoped>
// /deep/.ant-table-tbody .ant-table-row td{
//   display: table-cell !important;
//   vertical-align: top;
// }
/deep/ .ant-table-middle > .ant-table-content > .ant-table-scroll > .ant-table-body > table > .ant-table-tbody > tr > td{
  padding:5px;
}
/deep/.ant-tag{
  font-size: 11px !important;
  padding: 0 7px !important;
  line-height: inherit;
}
.product-name{
  overflow: hidden;
  label{
    float: left;
  }  
  .content{
  text-align: left;
  white-space: break-spaces;
  a{
    text-decoration: underline;
  }
  }
}
.row{
 display: flex;
 a{
    text-decoration: underline;
  }
}
.err-msg{
  font-size: 12px;
  color: red;
}
</style>